<template>
  <div class="profile">
  <form>
  <h2>个人信息</h2>
  <table>
    <tbody>
    <tr>
      <td>*姓名</td>
      <td>
        <input type="text" v-model="myinfo.name">
      </td>
    </tr>
    <tr>
      <td>*编号</td>
      <td>
        <input type="text" v-model="myinfo.id">
      </td>
    </tr>
    <tr>
      <td>*性别</td>
      <td>
        <input type="radio" v-model="myinfo.sex" name="sex" value="men">男
        <input type="radio" v-model="myinfo.sex" name="sex" value="women">女
      </td>
    </tr>
    <tr>
      <td>*手机号</td>
      <td>
        <input type="text" v-model="myinfo.phone">
      </td>
    </tr>
    <tr>
      <td>*学校</td>
      <td>
        <input type="text" v-model="myinfo.school">
      </td>
    </tr>
    <tr>
      <td>*专业</td>
      <td>
        <input type="text" v-model="myinfo.major">
      </td>
    </tr>
    <tr>
      <td>*人员属性</td>
      <td>
        <input type="text" v-model="myinfo.attribute">
      </td>
    </tr>
    </tbody>
  </table>
  <input type="button" value="提交" @click="submit">
  </form>
</div>
</template>

<script setup>
import { useRouter } from "vue-router"


const router = new useRouter()
const myinfo = {
  name:'',
  id:0,
  sex:'',
  phone:0,
  school:'',
  major:'',
  attribute:''
}
const submit = () => {
  router.push('/')
}

</script>

<style scoped>
*{
  margin: 0;
  padding: 0;
}

.profile{
  background-color: rgb(214, 205, 205);
  max-width: 100vw;
  max-height: 100vh;
  
}
form{
  background-color: #fff;
  height: 700px;
  width: 340px;
  position: relative;
  top: 20px;
  left: 30px;
  border-radius: 20px;
  padding: 20px;
  margin-top: 40px;
}


</style>